@charset "utf-8";

.game{
    .container{
        .game_item{
            .game_Img{
                position: relative;
                padding-top: 20px;
                img{
                    max-width: 100%;
                }
                p{
                    padding-top: 25px;
                    padding-bottom: 31px;
                    position: absolute;
                    top: 0;
                    left: 15px;
                    background-color: red;
                    writing-mode: tb;
                    font-size: 20px;
                    color: white;
                    &::after{
                        content: "";
                        position: absolute;
                        border: 14px solid transparent;
                        border-bottom: 14px solid #F7F7F7;
                        left: 0;
                        bottom: 0;
                    }
                }
            }
            .game_text{
                padding-right: 15px;
                &.text_right{
                    text-align: right;    
                }
                &.text_left{
                    text-align: left;    
                }
                
                >h4{
                    font-size: 30px;
                    color: #2A2A2A;
                }
                >p{
                    color: #898989;
                    font-size: 12px;
                    word-spacing: 3px;
                    line-height: 2.5;
                }
                .game_ul{
                    list-style: none;
                    font-size: 0;
                    padding-left: 0;
                    >li{
                        display: inline-block;
                        margin: 15px 0;
                        img{
                            width: 100%;
                        }
                    }
                }
            }
        }
    }
}
 .case{
    padding-top: 15px;
    .container{
        >h4{
            color: #010101;
            font-size: 36px;
        }
        .case_item{
            list-style: none;
            font-size: 0;
            padding-left: 0;
            >li{
                display: inline-block;
                margin: 15px 0;
                img{
                    width: 100%;
                }
                >p{
                    padding-top: 13px;
                    text-align: center;
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    font-size: 14px;
                    color: #2A2A2A;
                }
            }
        }
    }
}

@media (max-width: 767px){
    .container-fluid{
         .case{
            .container{
                >h4{
                    color: #010101;
                    font-size: 30px;
                }
                .case_item{
                    >li{
                        margin: 5px 0;
                        >p{
                            padding-top: 5px;
                            margin-bottom: 0px;
                        }
                    }
                }
            }
        }
    }
}